.bottom-container {
    position: fixed;
    width: 100%;
    bottom: 0px;
}

.input-base {
    height: 100%;
    padding: 5px;
    background-color: #f3f3f3;
    position: relative;
    border-bottom: 1px solid #bbb;
}

.bottom-icons {
    width: 23%;
    height: 30px;
    position: absolute;
    top: 50%;
    right: 0px;
    margin-top: -15px;
    text-align: center;
}

/*机器人界面左侧的转接按钮*/
.left-bottom-icons {
    width: 10%;
    height: 30px;
    /*position: absolute;*/
    top: 50%;
    left: 0px;
    /*margin-top: -15px;*/
    text-align: center;
    float: left;
}

/*机器人界面右侧的发送按钮*/
.right-bottom-icons {
    width: 12%;
    height: 30px;
    top: 50%;
    right: 0px;
    text-align: center;
    float: left;
}

.bottom-icons .bottom-message-send {
    display: none;
}

.bottom-icons .bottom-icon {
    display: block;
}
.bottom-icons .upload-pictures-hide{
    display: none;
}
.bottom-send .bottom-icon {
    display: none;
}

.bottom-send .bottom-message-send {
    display: block;
}

.bottom-face-icon {
    height: 100%;
    width: 50%;
    float: left;
}

.bottom-forward-icon {
    height: 100%;
    float: left;
}

.bottom-option-icon {
    height: 100%;
    width: 50%;
    float: right;
}

/*机器人界面的send按钮*/
.right-bottom-icons .bottom-send-icon{
    width: 100%;
}

.bottom-send-icon{
    height: 100%;
    float: left;
    width: 48%;
    line-height: 30px;
    border-radius: 4px;
    background: #007aff;
    color: #ffffff;
    font-size: 12px;
    cursor: pointer;
}

.input-base img {
    height: 100%;
}

.bottom-chat-edit {
    width: 72%;
    float: left;
    line-height: 20px;
    padding: 5px;
    font-size: 16px;
    border: 1px solid #ccc8c3;
    border-radius: 5px;
    background: #fff;
    max-height: 97px;
    overflow-y: auto;
    outline: none;
    margin: 0 4px;
}

.bottom-qq-face-container,
.bottom-option-container {
    height: 230px;
    position: relative;
}

.bottom-option-container{
    padding: 0px 50px;
}

.bottom-option-icons-container {
    position: absolute;
    top: 50%;
    margin-top: -44px;
}

.bottom-footer {
    text-align: center;
    background-color: #EDEAEA;
}

.option-icon {
    float: left;
    font-size: 10px;
    color: #8c8c8c;
    width: 64px;
}

.option-icon img {
    margin-bottom: 10px;
    width: 100%;
}

/** 表情滑动控件样式 begin */
.viewport {
    width: 100%;
    overflow: hidden;
    -webkit-transform: translateZ(0); /* Optional: When heavy at iOS6+ */
}

.flipsnap {
    width: 100%; /* 320px(item width) * 3(item count) */
}

.flipsnap:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
}

.item {
    box-sizing: border-box;
    float: left;
    width: 33%;
    font-size: 50px;
    text-align: center;
    padding: 0px 13px;
    color: #666;
}

.item-new{
    width: 100%;
    font-size: 50px;
    text-align: center;
    padding: 0px 13px;
    color: #666;
}

.face-cont{
    width: 100%;
}

.face-row{
    display: -webkit-box;
    width: 100%;
    line-height: 45px;
}

.face-block{
    box-sizing:border-box;
    -webkit-box-flex: 1;
    width: 10%;
    text-align: center;
}

.pointer span {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: #f5f5f1;
    margin: 0px 5px;
}

.pointer span.current {
    background: #989191;
}

/** 表情滑动控件样式 end*/

